<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="找回密码" />
<meta name="description" content="找回密码" />
<title>找回密码 - <{$common.site_name}></title>
<link rel="stylesheet" type="text/css" href="<{$common.theme}>/style/general.css" />
<link rel="stylesheet" type="text/css" href="<{$common.theme}>/style/login.css" />
<script type="text/javascript" src="<{$common.theme}>/js/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="<{$common.theme}>/js/general.js"></script>
</head>
<body>
<!-- 头部开始 -->
<div class="header">
  <div class="w900 mt30 cut">
    <div class="logo"><a href="<{$common.url}>"><img alt="Verydows" src="<{$common.theme}>/images/logo.gif" /></a></div>
  </div>
</div>
<!-- 头部结束 -->
<!-- 主体开始 -->
<div class="container w900 mt20">
  <div class="wbox cut">
    <div class="retrieve cut">
      <h2 class="aln-c">找回密码</h2>
      <{if @$_GET['step'] == 'verify'}>
      <div class="step x-auto mt20 cut">
        <ul>
          <li class="passed"><div class="circle">1</div><p>填写用户名</p><div class="axis"></div></li>
          <li class="passed"><div class="circle">2</div><p>验证邮箱</p><div class="axis"></div></li>
          <li><div class="circle">3</div><p>设置新密码</p></li>
          <li><div class="circle">4</div><p>完成</p></li>
        </ul>
        <div class="xaxis"></div>
      </div>
      <div class="sfm mt20 pad10 x-auto">
        <dl class="table">
          <dt>用户名：</dt>
          <dd><{$user.username}></dd>
        </dl>
        <dl class="table">
          <dt>邮箱：</dt>
          <dd><{$user.email}></dd>
        </dl>
        <div class="mt20 pl100"><a class="sm-blue" href="<{url c='user' a='retrieve_pwd' step='sendmail' token=$token}>">发送验证邮件</a></div>
      </div>
      <{elseif @$_GET['step'] == 'waiting'}>
      <div class="step x-auto mt20 cut">
        <ul>
          <li class="passed"><div class="circle">1</div><p>填写用户名</p><div class="axis"></div></li>
          <li class="passed"><div class="circle">2</div><p>验证邮箱</p><div class="axis"></div></li>
          <li><div class="circle">3</div><p>设置新密码</p></li>
          <li><div class="circle">4</div><p>完成</p></li>
        </ul>
        <div class="xaxis"></div>
      </div>
      <div class="mt20 pad10 aln-c">
        <h3 class="f14 green">验证邮件已发送成功！</h3>
        <p class="mt15 c999">验证邮件在 <b>2</b> 小时内有效，请尽快登录您的邮箱点击验证链接完成验证。</p>
      </div>
      <{elseif @$_GET['step'] == 'validated'}>
      <script type="text/javascript">
        function submitSetpwd(){
          var form = $('#setpwd-form'), password = form.find('input[name="password"]');
          password.vdsChecker({password:true});
          form.find('input[name="repassword"]').vdsChecker({equal:password.val()}, {equal:'两次密码不一致'});
          form.vdsSubmit(true);
        }
      </script>
      <div class="step x-auto mt20 cut">
        <ul>
          <li class="passed"><div class="circle">1</div><p>填写用户名</p><div class="axis"></div></li>
          <li class="passed"><div class="circle">2</div><p>验证邮箱</p><div class="axis"></div></li>
          <li class="passed"><div class="circle">3</div><p>设置新密码</p><div class="axis"></div></li>
          <li><div class="circle">4</div><p>完成</p></li>
        </ul>
        <div class="xaxis"></div>
      </div>
      <div class="sfm mt20 pad10 x-auto">
        <form method="post" action="<{url c='user' a='retrieve_pwd' step='setpwd' token=$token}>" id="setpwd-form">
          <dl class="table">
            <dt>设置新密码：</dt>
            <dd>
              <input title="新密码" type="password" name="password" class="txt" data-warnpos="fixed" />
              <p class="caaa">密码可包含字母、数字或特殊符号，长度为6~32个字符</p>
            </dd>
          </dl>
          <dl class="table">
            <dt>确认新密码：</dt>
            <dd>
              <input title="确认新密码" type="password" name="repassword" class="txt" data-warnpos="fixed" />
              <p class="caaa">再次输入您所设置的新密码</p>
            </dd>
          </dl>
          <div class="pl120"><button type="button" class="sm-blue" onclick="submitSetpwd()">确定并提交</button></div>
        </form>
      </div>
      <{elseif @$_GET['step'] == 'setpwd'}>
      <div class="step x-auto mt20 cut">
        <ul>
          <li class="passed"><div class="circle">1</div><p>填写用户名</p><div class="axis"></div></li>
          <li class="passed"><div class="circle">2</div><p>验证邮箱</p><div class="axis"></div></li>
          <li class="passed"><div class="circle">3</div><p>设置新密码</p><div class="axis"></div></li>
          <li class="passed"><div class="circle">4</div><p>完成</p><div class="axis"></div></li>
        </ul>
        <div class="xaxis"></div>
      </div>
      <div class="mt20 pad10 aln-c">
        <h3 class="f14 green">设置新密码完成！请牢记您设置的新密码</h3>
        <p class="mt15 c666">您现在可以用新密码登录您的账户<a class="ml10" href="<{url c='user' a='login'}>">点击登录</a></p>
      </div>
      <{else}>
      <script type="text/javascript">
        function submitRetrieve(){
          var form = $('#retrieve-form');
          form.find('input[name="username"]').vdsChecker({required:true});
          form.find('input[name="captcha"]').vdsChecker({required:true});
          $('#retrieve-form').vdsSubmit(true);
        }
      </script>
      <div class="step x-auto mt20 cut">
        <ul>
          <li class="passed"><div class="circle">1</div><p>填写用户名</p><div class="axis"></div></li>
          <li><div class="circle">2</div><p>验证邮箱</p></li>
          <li><div class="circle">3</div><p>设置新密码</p></li>
          <li><div class="circle">4</div><p>完成</p></li>
        </ul>
        <div class="xaxis"></div>
      </div>
      <div class="sfm mt20 pad10 x-auto">
        <form method="post" action="<{url c='user' a='retrieve_pwd' step='verify'}>" id="retrieve-form">
          <dl class="table">
            <dt>用户名：</dt>
            <dd><input title="用户名" type="text" name="username" class="txt" data-warnpos="fixed" /></dd>
          </dl>
          <dl class="table mt8">
            <dt>验证码：</dt>
            <dd><input title="验证码" type="text" name="captcha" class="txt" data-warnpos="fixed" /></dd>
          </dl>
          <div class="mt5 pl120"><img id="captcha-img" src="<{url c='image' a='captcha'}>" /><a class="ml10 pointer" onclick="$('#captcha-img').attr('src', '<{url c='image' a='captcha'}>&'+Math.random());">看不清? 换一张</a></div>
          <div class="mt15 pl120"><button class="sm-blue" type="button" onclick="submitRetrieve()">确定并提交</button></div>
        </form>
      </div>
      <{/if}>
    </div>
  </div>
</div>
<!-- 主体结束 -->
<div class="cl"></div>
<!-- 页脚开始 -->
<{layout_footer}>
<!-- 页脚结束 -->
</body>
</html>